@charset 'UTF-8';

.container {
    width: 1200px;
    margin: 0 auto;
}



@media screen and (min-width:1000px) {
    .culture_jq_warp {
        .main_pic {
            img {
                width: 100%;
            }
        }

        .main_pic_b {
            overflow: hidden;

            .container {
                .title {
                    h2 {
                        font-size: 26px;
                        visibility: visible;
                        animation-duration: 1s;
                        animation-delay: 0.2s;
                        animation-name: fadeInUp;
                        margin-top: 50px;
                        padding-bottom: 10px;
                        border-bottom: 1px solid #ccc;
                        color: #6e7276;
                    }
                }

                .cons {
                    margin-top: 30px;

                    .con {
                        visibility: visible;
                        animation-duration: 1s;
                        animation-delay: 0.6s;
                        animation-name: fadeInUp;

                        p {
                            margin-top: 23px;
                            color: #858a95;

                            &:nth-child(1) {
                                margin-top: 40px;
                            }
                        }
                    }
                }
            }
        }

        .pic {
            margin-top: 50px;

            .container {
                .cons {
                    ul {
                        li {
                            padding: 0 5px;
                            float: left;
                            width: 33.33%;
                            overflow: hidden;
                            cursor: default;

                            a {
                                visibility: visible;
                                animation-duration: 1s;
                                animation-delay: 0s;
                                animation-name: bounceIn;
                                margin-top: 10px;

                                .con {
                                    overflow: hidden;

                                    &:hover img {
                                        transform: scale(1.05);
                                        transition: 0.8s all ease;
                                    }

                                    img {
                                        width: 100%;

                                    }
                                }
                            }
                        }
                    }
                }
            }
        }

        .pic_b {
            margin: 30px 0;

            .container {
                padding: 0 15px;

                .cons {
                    position: relative;

                    .left {
                        margin-left: 15px;
                        position: absolute;
                        left: 0;
                        top: 0;
                        bottom: 0;
                        width: 38%;
                        height: 379px;
                        background-image: url(../images/s_13.jpg);
                        background-size: cover;
                        background-position: center;


                        .centent {
                            display: flex;
                            // align-items: center;
                            flex-wrap: wrap;
                            // text-align: center;
                            justify-content: center;


                            .con {
                                margin-top: 80px;
                                width: 100%;
                                text-align: center;
                                // flex: 1;
                            }

                            .but {
                                // display: inline-block;
                                border: 2px solid #fff;
                                color: #fff;
                                margin-top: 20px;
                                padding: 5px 20px;
                                border-radius: 100px;
                                align-self: center;
                            }
                        }
                    }

                    .right {
                        width: 62%;
                        overflow: auto;
                        margin-left: 38%;

                        .con {
                            img {
                                width: 100%;
                                height: 379px;
                            }
                        }
                    }
                }
            }
        }
    }
}

@media screen and (max-width:750px) {
    html {
        font-size: calc(100vw/7.5);
    }

    .container {
        width: 355px;
        margin: 0 auto;
        overflow: hidden;
    }

    .culture_jq_warp {
        overflow: hidden;

        .main_pic {
            position: relative;

            img {
                position: absolute;
                height: 150px;
                width: auto;
                left: 50%;
                margin-left: -365px;
            }
        }

        .main_pic_b {
            overflow: hidden;
            margin-top: 130px;

            .container {
                padding-left: 0;
                padding-right: 0;
                .title {
                    h2 {
                        font-size: 22px;
                        visibility: visible;
                        animation-duration: 1s;
                        animation-delay: 0.2s;
                        animation-name: fadeInUp;
                        margin-top: 50px;
                        padding-bottom: 10px;
                        border-bottom: 1px solid #ccc;
                        color: #6e7276;
                    }
                }

                .cons {
                    margin-top: 30px;

                    .con {
                        visibility: visible;
                        animation-duration: 1s;
                        animation-delay: 0.6s;
                        animation-name: fadeInUp;

                        p {
                            margin-top: 23px;
                            color: #858a95;
                            font-size: 13.6px;

                            &:nth-child(1) {
                                margin-top: 40px;
                            }
                        }
                    }
                }
            }
        }

        .pic {
            margin-top: 50px;

            .container {
                .cons {
                    ul {
                        li {
                            padding: 0 5px;
                            float: left;
                            width: 33.33%;
                            overflow: hidden;
                            cursor: default;

                            a {
                                visibility: visible;
                                animation-duration: 1s;
                                animation-delay: 0s;
                                animation-name: bounceIn;
                                margin-top: 10px;

                                .con {
                                    overflow: hidden;

                                    &:hover img {
                                        transform: scale(1.05);
                                        transition: 0.8s all ease;
                                    }

                                    img {
                                        width: 100%;

                                    }
                                }
                            }
                        }
                    }
                }
            }
        }

        .pic_b {
            margin: 30px 0;

            .container {
                padding: 0 15px;

                .cons {
                    position: relative;

                    .left {
                        // margin-left: 15px;
                        // position: absolute;
                        // left: 0;
                        // top: 0;
                        // bottom: 0;
                        position: relative;
                        height: 240px;
                        width: 100%;
                        overflow: auto;
                        background-image: url(../images/s_13.jpg);
                        background-size: cover;
                        background-position: center;
                        

                        .centent {
                            display: flex;
                            flex-wrap: wrap;
                        align-items: center;
                            justify-content: center;

                            .con {
                                text-align: center;
                                width: 100%;
                                margin-top: 40px;
                                // flex: 1;
                                img {
                                    width: 120px;
                                }
                            }

                            .but {
                                display: inline-block;
                                border: 2px solid #fff;
                                color: #fff;
                                margin-top: 20px;
                                padding: 5px 20px;
                                border-radius: 100px;
                            }
                        }
                    }

                    .right {
                        width: 100%;
                        overflow: auto;
                        // margin-left: 38%;

                        .con {
                            img {
                                width: 100%;
                                // height: 379px;
                            }
                        }
                    }

                    .col-xs-12,
                    .col-sm-12 {
                        padding-left: 0;
                        padding-right: 0;
                    }
                }
            }
        }
    }
}